$(function () {

    // 打开浏览器自动加载默认页面
    console.log('ok');
    function getwindow() {
        // 调用ajax方法 传入参数 进行配置
        $.ajax({
            url: 'http://localhost:3000/play/new', //url地址随选中调换
            success(data) {
                // console.log(data);
                var content = '';
                // 拼接字符串 准备好内容
                $.each(data, function (i, goods) {

                    for (var i = 0; i < data.length; i++) {
                        content += '<li><img class="img" src="' + goods[i].img + '" alt=""><p class="p1">'
                            + goods[i].text + '</p><span class="s1">'
                            + goods[i].price + '</span><span class="s2"><img src="../css.img/img/xin.png">' + goods[i].like +
                            '</span><span class="s3"><img src="../css.img/img/reply.png">' + goods[i].words + '</span></li>'
                    }
                })
                // document.write(content);
                // 通过html方法 将内容加到指定元素中
                ul.html(content)
            }
        })
    }
    getwindow()

    //变量组
    var ul = $('.ul');
    var xz = $('.play-xz');
    var div1 = $('.content-new')
    var div2 = $('.content-hot')
    var div3 = $('.content-con')
    $.each(xz, function (index, el) {
        // 切换标题
        $(el).click(function () {
            $('.play-xz.title').removeClass('title')
            $(this).addClass('title')

            // 切换内容
            var thisName = $(this).attr('count1');;
            if (thisName == 'content-new') {
                div1.show();
                div2.hide();
                div3.hide();
                //调换接口地址 url 

                function getData(url) {
                    // 调用ajax方法 传入参数 进行配置
                    $.ajax({
                        url: 'http://localhost:3000/' + url, //url地址随选中调换
                        success(data) {
                            // console.log(data);
                            var content = '';
                            // 拼接字符串 准备好内容
                            $.each(data, function (i, goods) {

                                for (var i = 0; i < data.length; i++) {
                                    content += '<li><img class="img" src="' + goods[i].img + '" alt=""><p class="p1">'
                                        + goods[i].text + '</p><span class="s1">'
                                        + goods[i].price + '</span><span class="s2"><img src="../css.img/img/xin.png">' + goods[i].like +
                                        '</span><span class="s3"><img src="../css.img/img/reply.png">' + goods[i].words + '</span></li>'
                                }
                            })
                            // document.write(content);
                            // 通过html方法 将内容加到指定元素中
                            ul.html(content)
                        }
                    })
                }

                getData('play/new')
            }
            else if (thisName == 'content-hot') {
                div1.hide();
                div2.show();
                div3.hide();
                function getData2(url) {
                    // 调用ajax方法 传入参数 进行配置
                    $.ajax({
                        url: 'http://localhost:3000/' + url, //url地址随选中调换
                        success(data) {
                            // console.log(data);
                            var content = '';
                            // 拼接字符串 准备好内容
                            $.each(data, function (i, goods) {

                                for (var i = 4; i < 8; i++) {
                                    content += '<li><img class="img" src="' + goods[i].img + '" alt=""><p class="p1">'
                                        + goods[i].text + '</p><span class="s1">'
                                        + goods[i].price + '</span><span class="s2"><img src="../css.img/img/xin.png">' + goods[i].like +
                                        '</span><span class="s3"><img src="../css.img/img/reply.png">' + goods[i].words + '</span></li>'
                                }
                            })
                            // document.write(content);
                            // 通过html方法 将内容加到指定元素中
                            ul.html(content)
                        }
                    })
                }

                getData2('play/hot')

            }
            else if (thisName == 'content-con') {
                div1.hide()
                div3.hide()
                div2.show()
                function getData2(url) {
                    // 调用ajax方法 传入参数 进行配置
                    $.ajax({
                        url: 'http://localhost:3000/' + url, //url地址随选中调换
                        success(data) {
                            console.log(data);
                            var content = '';
                            // 拼接字符串 准备好内容
                            $.each(data, function (i, goods) {

                                for (var i = 0; i < data.length; i++) {
                                    content += '<li><p class="p1">'
                                        + goods[i].text + '</p><span class="s1">'
                                        + goods[i].price + '</span><span class="s2"><img src="../css.img/img/xin.png">' + goods[i].like +
                                        '</span><span class="s3"><img src="../css.img/img/reply.png">' + goods[i].words + '</span></li>'
                                }
                            })
                            // document.write(content);
                            // 通过html方法 将内容加到指定元素中
                            ul.html(content)
                        }
                    })
                }
                getData('play/category')
            }
        })
    })
})
